<script setup lang="ts">
import { storeToRefs } from 'pinia';

import { payOrderStore } from '#/store';

import OrderInfo from './orderInfo.vue';
import ProfitTime from './profitTime.vue';
import SourceInfo from './sourceInfo.vue';

const payOrder = payOrderStore();
const {
  selectItemInfos,
  // payType
} = storeToRefs(payOrder);
const columns = [
  {
    title: '店铺/订单',
    dataIndex: 'shopInfo',
    key: 'shopInfo',
    width: 200,
    align: 'center',
  },
  {
    title: '订单信息',
    dataIndex: 'orderInfo',
    key: 'orderInfo',
    width: 350,
    align: 'left',
  },
  {
    title: '货源信息',
    dataIndex: 'sourceInfo',
    key: 'sourceInfo',
    width: 350,
    align: 'left',
  },
  {
    title: '利润',
    dataIndex: 'profit',
    key: 'profit',
    width: 160,
    align: 'center',
  },
  {
    title: '状态',
    dataIndex: 'payStatus',
    key: 'payStatus',
    width: 150,
    align: 'center',
  },
  {
    title: '操作',
    dataIndex: 'action',
    key: 'action',
    align: 'center',
    // width: 180,
    fixed: 'right',
  },
];
</script>

<template>
  <div class="scurolss">
    <a-table
      :columns="columns"
      :data-source="selectItemInfos"
      :scroll="{ y: 600 }"
      row-key="tbId"
      style="width: 100%; overflow-x: hidden"
    >
      <template #bodyCell="{ column, record }">
        <OrderInfo
          v-if="column.key === 'orderInfo' || column.key === 'shopInfo'"
          :order-info="record"
          :temp="column.key"
        />
        <ProfitTime v-if="column.key === 'profit'" :order-info="record" />
        <template v-if="column.key === 'sourceInfo'">
          <SourceInfo :order-info="record" />
          <!-- <a-tag :color="record.offerId ? 'success' : 'default'">
            {{ record.offerId || '未关联货源' }}
          </a-tag> -->
        </template>
        <template v-if="column.key === 'payStatus'">
          <a-space direction="vertical">
            <a-tag
              :color="
                record.pystyres?.status === 2
                  ? 'error'
                  : record.pyobj.pytstyas === 3
                    ? 'success'
                    : 'default'
              "
            >
              {{
                record.pystyres?.status === 0
                  ? record.pyobj.pytstr
                  : record.pystyres?.status === 1
                    ? '成功'
                    : '失败'
              }}
            </a-tag>
            <div
              v-if="record.pystyres?.status === 2"
              class="text-xs"
              style="color: red"
            >
              {{ record.pystyres.msg }}
            </div>
          </a-space>
        </template>
        <template v-if="column.key === 'action'">
          <a-button type="link" @click="payOrder.removeSelectItemInfo(record)">
            移除
          </a-button>
        </template>
      </template>
    </a-table>
  </div>
</template>
<style scoped lang="scss">
// .scurolss {
//   height: 600px;
//   overflow: hidden scroll;
// }
</style>
